<template>
	<view class="w-100">
		<view class="flex-1 mt-2">
			<view class="flex-1 row-ac mx-3">
				<view class="row-ac font-s-3 text-light-grey ml-3" style="width: 120rpx;">收货人</view>
				<view class="flex-1 ml-2 mr-5 border-bottom">
					<input type="text" v-model="fromAddress.name" value="" placeholder="收货人" class="py-2" />
				</view>
			</view>
			<view class="flex-1 row-ac mx-3 mt-2">
				<view class="row-ac font-s-3 text-light-grey ml-3" style="width: 120rpx;">联系电话</view>
				<view class="flex-1 ml-2 mr-5 border-bottom">
					<input type="text" v-model="fromAddress.mobile" value="" placeholder="联系电话" class="py-2" />
				</view>
			</view>
			<view class="flex-1 row-ac mx-3 mt-2">
				<view class="row-ac font-s-3 text-light-grey ml-3" style="width: 120rpx;">城市</view>
				<view class="flex-1 ml-2 mr-5 border-bottom">
					<input type="text" v-model="fromAddress.city" value="" placeholder="如:广州,上海,深圳,北京" class="py-2" />
				</view>
			</view>
			<view class="flex-1 row-ac mx-3 mt-2">
				<view class="row-ac font-s-3 text-light-grey ml-3" style="width: 120rpx;">区</view>
				<view class="flex-1 ml-2 mr-5 border-bottom">
					<input type="text" v-model="fromAddress.district" value="" placeholder="如:白云区,花都区" class="py-2" />
				</view>
			</view>
			<view class="flex-1 row-ac mx-3 mt-2">
				<view class="row-ac font-s-3 text-light-grey ml-3" style="width: 120rpx;">详细地址</view>
				<view class="flex-1 ml-2 mr-5 border-bottom">
					<input type="text" v-model="fromAddress.detail" value="" placeholder="详细地址" class="py-2" />
				</view>
			</view>
			<view class="flex-1 mt-5 row">
				<view class="add-box rounded row" @click="toBack">取消</view>
				<view class="add-box ml-4 row rounded" @click="putAddres">修改</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		addressDetailUrl,
		addressUpdateUrl
	} from '@/api/index.js';
	export default {
		data() {
			return {
				fromAddress: {
					name: '',
					mobile: '',
					province: '中国',
					city: '',
					district: '',
					detail: '',
					is_default: false
				},
				addressStatu: false,
				getAddressId: ''
			}
		},
		onLoad(options) {
			this.init(options)
			this.getAddressId = options.addressId
		},
		methods: {
			init(options) {
				this.getAddressDetails(options.addressId)
			},
			getAddressDetails(addressId) {
				this.$R.get(addressDetailUrl + addressId + '/').then(res => {
					if (res.code == 200) {
						this.fromAddress = {
							name: res.data.name,
							mobile: res.data.mobile,
							province: res.data.province,
							city: res.data.city,
							district: res.data.district,
							detail: res.data.detail,
							is_default: res.data.is_default
						}
					}
				})
			},
			putAddres() {
				this.$R.put(addressUpdateUrl + this.getAddressId + '/', this.fromAddress).then(res => {
					if (res.code == 200) {
						uni.showToast({
							title: '添加成功'
						});
						uni.navigateBack({
							delta: 1
						});
					}
				})
			},
			toBack() {
				uni.navigateBack({
					delta: 1
				});
			}
		}
	}
</script>

<style lang="scss">
	.add-box {
		width: 220rpx;
		height: 80rpx;
		border: 1rpx solid #AAAAAA;
	}
</style>